<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>校园宿舍管理系统 - 首页</title>
    <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/css/bootstrap.min.css" rel="stylesheet">
    <style>
        body {
            background-color: #f0f4f7;
        }
        .feature-icon {
            font-size: 2rem;
            color: #17a589;
        }
        .card-custom {
            border-radius: 15px;
            box-shadow: 0 4px 8px rgba(0,0,0,0.05);
        }
        .navbar-brand {
            font-weight: bold;
            font-size: 1.5rem;
        }
    </style>
</head>
<body>
<nav class="navbar navbar-expand-lg navbar-dark" style="background-color: #17a589;">
    <div class="container">
        <a class="navbar-brand" href="#">校园宿舍管理系统</a>
        <div class="collapse navbar-collapse">
            <ul class="navbar-nav me-auto">
                <li class="nav-item">
                    <a class="nav-link active" th:href="@{/home}">首页</a>
                </li>
                <li class="nav-item">
                    <a class="nav-link" th:href="@{/student/list}">学生管理</a>
                </li>
                <li class="nav-item">
                    <a class="nav-link" th:href="@{/dormitory/list}">宿舍管理</a>
                </li>
            </ul>
            <div class="d-flex">
                <span class="navbar-text me-3" th:text="'欢迎，' + ${session.user.username}"></span>
                <a class="btn btn-outline-light" th:href="@{/user/changePassword}">修改密码</a>
                <a class="btn btn-outline-light ms-2" th:href="@{/user/logout}">退出</a>
            </div>
        </div>
    </div>
</nav>

<div class="container mt-5">
    <div class="row text-center mb-5">
        <div class="col-md-10 mx-auto">
            <h2 class="fw-bold">校园宿舍管理系统</h2>
            <p class="text-muted">一个现代化、高效的学生宿舍管理平台，助您轻松完成各类宿舍管理工作。</p>
        </div>
    </div>

    <div class="row g-4">
        <div class="col-md-4">
            <div class="card card-custom h-100">
                <div class="card-body text-center">
                    <div class="feature-icon mb-3"><i class="bi bi-person-fill"></i></div>
                    <h5 class="card-title">学生管理</h5>
                    <p class="card-text text-muted">查看和管理学生信息，包括入住、调宿、退宿等操作。</p>
                    <a th:href="@{/student/list}" class="btn btn-outline-success btn-sm">进入管理</a>
                </div>
            </div>
        </div>
        <div class="col-md-4">
            <div class="card card-custom h-100">
                <div class="card-body text-center">
                    <div class="feature-icon mb-3"><i class="bi bi-building"></i></div>
                    <h5 class="card-title">宿舍管理</h5>
                    <p class="card-text text-muted">全面管理宿舍楼及房间信息，实时掌握宿舍分配状态。</p>
                    <a th:href="@{/dormitory/list}" class="btn btn-outline-primary btn-sm">进入管理</a>
                </div>
            </div>
        </div>
        <div class="col-md-4">
            <div class="card card-custom h-100">
                <div class="card-body text-center">
                    <div class="feature-icon mb-3"><i class="bi bi-gear-fill"></i></div>
                    <h5 class="card-title">系统设置</h5>
                    <p class="card-text text-muted">配置用户权限、修改密码以及调整系统相关参数。</p>
                    <a th:href="@{/user/changePassword}" class="btn btn-outline-warning btn-sm">前往设置</a>
                </div>
            </div>
        </div>
    </div>

    <hr class="my-5">
    <div class="row">
        <div class="col-md-8 mx-auto">
            <div class="card card-custom">
                <div class="card-header bg-light">
                    <h5 class="mb-0">当前登录用户</h5>
                </div>
                <div class="card-body">
                    <p class="card-text">用户名：<strong th:text="${session.user.username}"></strong></p>
                    <p class="card-text">角色：<strong th:text="${session.user.role == 'admin' ? '管理员' : '普通用户'}"></strong></p>
                    <small class="text-muted">请从上方导航栏选择功能以开始操作</small>
                </div>
            </div>
        </div>
    </div>
</div>
</body>
</html>